{% extends "views/common/layout.html" %} {% block head %}
<link rel="stylesheet" type="text/css" href="{{body.commonCss}}">
<link rel="stylesheet" type="text/css" href="{{body.pageCss}}"> {% endblock %} {% block body %}


<div class="banner">
    <h1 class="banner-head">
        <div class="banner-title">
            {{body.data.subTitle.main | safe}}
        </div>
        <div class="banner-subtitle">
            {{body.data.subTitle.other | safe}}
        </div>
        
    </h1>
</div>

<div class="l-content">
    <div class="pricing-tables pure-g">
            
        {% for item in body.data.catePrice %}
        <div class="pure-u-1 pure-u-md-1-3">
                {% if loop.index==1 %}
                    <div class="pricing-table pricing-table-free">
                {% elif loop.index==2 %}
                    <div class="pricing-table pricing-table-biz pricing-table-selected">
                {% elif loop.index==3 %}
                    <div class="pricing-table pricing-table-enterprise">
                {% endif %}
                    <div class="pricing-table-header">
                        <h2>{{item.name}}</h2>
                        <span class="pricing-table-price">
                            {{item.price}}
                            <span>每个月</span>
                        </span>
                    </div>
                    <ul class="pricing-table-list">
                        {% for val in item.tags %}
                            <li>{{val}}</li>
                        {% endfor %}
                    </ul>
                    <a href="{{item.url}}" class="button-choose pure-button">
                        选 择
                    </a>
                </div>
            </div>
        {% endfor %}



    </div>
    <!-- end pricing-tables -->

    <div class="information pure-g">
        {% for item in data.describes %}
            <div class="pure-u-1 pure-u-md-1-2">
                <div class="l-box">
                    <h3 class="information-head">{{item.name}}</h3>
                    <p>
                        {{item.content}}
                    </p>
                </div>
            </div>
        {% endfor %}
    </div>
    <!-- end information -->
</div>
<!-- end l-content -->



<script type="text/javascript" src="{{body.commonJs}}"></script>
<script type="text/javascript" src="{{body.pageJs}}"></script> {% endblock %}